import React, { useState } from 'react'
import { Table } from 'antd'
import { Row, Col } from 'antd';

export default function OperatorSth() {
    const [currentPage, setCurrentPage] = useState('1')
    const [pageSize, setPageSize] = useState('10')
    const columns = [
        {
            title: '通话号码',
            dataIndex: 'tonghuaPhone',
            key: 'tonghuaPhone',
        },
        {
            title: '通话地点',
            dataIndex: 'tonghuaPlace',
            key: 'tonghuaPlace',
        },
        {
            title: '呼叫类型',
            dataIndex: 'hujiaotype',
            key: 'hujiaotype',
        },
        {
            title: '通话时间',
            dataIndex: 'tonghuatime',
            key: 'tonghuatime',
        },
        {
            title: '通话时长',
            dataIndex: 'tonghualong',
            key: 'tonghualong',
        },
        {
            title: '通话类型',
            dataIndex: 'tonghuatype',
            key: 'tonghuatype',
        },
        {
            title: '套餐',
            dataIndex: 'tonghuataocan',
            key: 'tonghuataocan',
        }
    ]
    const data = [
        {
            key: '1',
            tonghuaPhone: 1928392212,
            tonghuaPlace: '六安',
            hujiaotype: '被叫',
            tonghuatime: 2016 - 3 - 5,
            tonghualong: 25 + "秒",
            tonghuatype: '国内被叫',
            tonghuataocan: 38
        },
        {
            key: '2',
            tonghuaPhone: 1928392212,
            tonghuaPlace: '354',
            hujiaotype: '被叫',
            tonghuatime: 2016 - 3 - 5,
            tonghualong: 25 + "秒",
            tonghuatype: '国内被叫',
            tonghuataocan: 38
        },
        {
            key: '3',
            tonghuaPhone: 1928392212,
            tonghuaPlace: 'frg',
            hujiaotype: '被叫',
            tonghuatime: 2016 - 3 - 5,
            tonghualong: 25 + "秒",
            tonghuatype: '国内被叫',
            tonghuataocan: 38
        },
    ];

    const getPage = (page, pageSize) => {
        console.log(page, pageSize)
        setCurrentPage(page)
        setPageSize(pageSize)
    }
    return (
        <div>
            <Row>
                <Col className='title'>
                    <p>借款信息</p>
                </Col>
            </Row>
            <Table columns={columns} dataSource={data}
                pagination={{
                    total: data.length,
                    showQuickJumper: true,
                    showSizeChanger: true,
                    pageSizeOptions: ['10', '20', '30'],
                    showTotal: total => `共${Math.ceil(total / pageSize)}页/ ${total} 条数据`,
                    onChange: getPage
                }}
                onRow={record => {
                    return {
                        onClick: event => { console.log(event, record) },
                    }
                }}
            />
        </div>

    )
}
